import React, { memo, useState, useEffect, useRef, useCallback } from "react";
import { useDispatch, useSelector, shallowEqual } from "react-redux";
import { AskDistoryWrapper } from "./style";
import PostArticle from "./child/post-article";
import { setOfficialLogin } from "@/service/user";
import { getMomment, getMommentTotal } from "@/service/discover";
import AskDiscoverMomment from "./child/momment";
export default memo(function AskDistory(props) {
  const {category_id}=props;
  const [ypytoken, setypytoken] = useState("");
  const [mommentList, setmommentList] = useState([]);
  const [mommentTotal, setmommentTotal] = useState(50);
  const [page, setpage] = useState(1);
  const [currentPage, setcurrentPage] = useState(1);
  const [pictureInfo, setpictureInfo] = useState([]);

  let { userDetail } = useSelector(
    (state) => ({
      userDetail: state.getIn(["public", "userDetail"]),
    }),
    shallowEqual
  );
  useEffect(() => {
    setOfficialLogin().then((res) => {
      setypytoken(res.data.data);
    });
  }, []);
  const setPage = (page) => {
 
    setpage(page);
    setcurrentPage(page);
  };
 
  const getMommentList = () => {
    let obj = {
      page,
      size: 15,
      category_id
    };
    getMomment(obj).then((res) => {
      setmommentList(res.data);
    });
    getMommentTotal({ category_id }).then((res) => {
      res.data[0] && setmommentTotal(res.data[0].count);
    });
  };

  useEffect(() => {
    getMommentList();
  }, []);

  useEffect(() => {
    getMommentList();
    window.scrollTo(0, 0);
  }, [page]);

  // 动态配图
  const setPictureInfo = (arr) => {
    setpictureInfo(arr);
  };

  const state = () => {
    getMommentList();
  };
  return (
    <AskDistoryWrapper>
      <PostArticle
        category_id={category_id}
        setPage={setPage}
        userDetail={userDetail}
        state={state}
        setPictureInfo={setPictureInfo}
        pictureInfo={pictureInfo}
      ></PostArticle>
      <AskDiscoverMomment
        mommentTotal={mommentTotal}
        setPage={setPage}
        currentPage={currentPage}
        userDetail={userDetail}
        state={state}
        mommentList={mommentList}
      ></AskDiscoverMomment>
    </AskDistoryWrapper>
  );
});
